<template>
	<view class="container">
		<button v-show="disp == 1" class="avatar-wrapper" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
			<view class='add_pic1' :style='{height:width}' data-type="id_face"><view>点击上传头像</view></view>
		</button>

		<input type="nickname" class="weui-input nickname input_text" data-name="name" @input="input_" :value="name" placeholder="请输入昵称" />
		<view class="lh"></view>
		<view class='button' :data-status="status" v-on:click='merchant_submit'>提交修改</view>
	</view>
</template>

<style>
	page{background: #FFFFFF !important;}
	.map_pic cover-image,.map_pic image{width:30upx;height: 30upx;}
	.nickname,.lbs{width:72%;height:50rpx;line-height: 50rpx;font-size:26rpx;border:1px solid #d1d1d1;border-radius: 10rpx;padding-left:2%;}
	.add_pic1{background: #d1d1d1;color: #666;font-size: 60rpx;width:100%;border:1px solid #d1d1d1;display: flex;align-items: center;margin:20rpx 0;text-align: center;justify-content: center;}

	.button{width:90%;margin:20upx 5%;font-size: 30upx;height: 80upx;position: fixed;bottom:0;left:0;
		border-radius: 50upx;background-image: linear-gradient(#43eac9, #24c3a4);color: #FFFFFF;text-align: center;line-height: 80upx;}
	.lh{width:100%;height: 120upx;}
	.nickname {
		border: solid 1px #b5abab;
		margin-left: 4%;
		width: 92%;
		height: 50px;
		text-align: center;
		line-height: 50px;
		font-size: 16px;
	}
</style>

<script>
	// import QQMapWX from  "../../static/js/qqmap-wx-jssdk.min.js";
	export default {
		data() {
			return {
				width:0,
				height:0,
				disp:1,
				theme:'',
				title:'',
				name:'',
				status:1,
				url: getApp().globalData.url,
			}
		},
		onLoad(e) {
			var res      = uni.getSystemInfoSync();
			var w      = res.windowWidth * 94 / 100 * 31 / 100;
			this.width  = w+"px";
			this.height = w+"px";
		},
		onShow(){

		},
		methods: {
			onChooseAvatar(e) {
				this.upload_file(e.detail.avatarUrl);
			},
			upload_file:function(filePath)
			{
				var member_id  = uni.getStorageSync("member_id");

				var that = this;

				uni.showLoading({
					title:"上传中",
					mask:true,
					success:(res)=>{
						uni.uploadFile({
							url:that.url+'/wechat_upload_avatar_url',
							filePath:filePath,
							name:'file',
							formData:{member_id:member_id},
							success:(res)=>{
								var res = JSON.parse(res.data);
								if (res.status == 1) {
									uni.showToast({
										title:"头像已更新",
										duration:1500
									});
									this.disp = 2;
								} else {
									uni.showToast({
										title:"系统错误",
										duration:1500
									});
								}
							}
						})
					}
				})
			},
			merchant_submit:function (e) {
				var status = e.currentTarget.dataset.status;
				var member_id   = uni.getStorageSync("member_id");
				if(status==1)//status防止重复提交
				{
					this.status = 0;
					var that = this;
					uni.request({
						url: that.url+'/wechat_update_member_nickname',
						data: {member_id:member_id,nickname:that.name},
						method:"POST",
						header: {'Content-Type': 'application/x-www-form-urlencoded'},
						success: (res) => {
							if(res.data.status==1)
							{
								that.status = 1;
								uni.switchTab({
									url:'/pages/member/index'
								});
							}
							else
							{
								uni.showToast({title:'系统错误',duration:2000});
							}
						}
					});
				}
			},
			input_:function(e)
			{
				if(e.currentTarget.dataset.name=="name")
				{
					this.name = e.target.value;
				}
			}
		}
	}
</script>